<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<title>Cherry_HappyChildrenDay</title>
		<link rel="stylesheet" href="css/blossoms.css" />
		<script src="js/blossoms.js"></script>
		<link href="css/default.css" type="text/css" rel="stylesheet">
		<script type="text/javascript" src="js/jquery.js"></script>
		<script type="text/javascript" src="js/garden.js"></script>
		<script type="text/javascript" src="js/functions.js"></script>
	</head>
	<body>

		<canvas id="sakura"></canvas>
		<div class="btnbg">
			<button type="button" onclick="toggleAnimation(this)">Stop</button>
		</div>
		
		<div id="mainDiv">
			<div id="content">
				<div id="code">
		        	象征着希望的樱花<br />
		            虽然过了花期</span><br />
		            <span class="keyword">但代码编制的樱花永不过期</span><br /><br />

		            生活让我们成熟<br />
		            且坚强<br />
		             <span class="keyword">那我们更要去寻找童真稚趣和赤子之心</span><br /><br />

					回忆儿时童真<br />
		            好多梦想装进冰箱<br />
		            <span class="keyword">天真的问长大了再拿出来行不行</span><br /><br />

					越长大才越懂得<br />
		            唯有时间与梦想<br />
		            <span class="keyword">不可辜负</span><br /><br />

		             <hr />
		   			<span class="keyword">Happy ChildrenDay to 妙脆角</span><br />
					-- ZoomToday<br />


				</div>
				<div id="loveHeart">
					<canvas id="garden"></canvas>
					<div id="words">
						<div id="messages">
						
							<div id="elapseClock"></div>
						</div>

					</div>
				</div>
			</div>
		</div>
		<script type="text/javascript">
		var offsetX = $("#loveHeart").width() / 2;
		var offsetY = $("#loveHeart").height() / 2 - 55;
		var together = new Date();

		together.setFullYear(2018, 5, 1);//1.23；3.29
		together.setHours(12);
		together.setMinutes(0);
		together.setSeconds(0);
		together.setMilliseconds(0);

		if (!document.createElement('canvas').getContext) {
			var msg = document.createElement("div");
			msg.id = "errorMsg";
			msg.innerHTML = "Your browser doesn't support HTML5!<br/>Recommend use Chrome 14+/IE 9+/Firefox 7+/Safari 4+";
			document.body.appendChild(msg);
			$("#code").css("display", "none")
			$("#copyright").css("position", "absolute");
			$("#copyright").css("bottom", "10px");
			document.execCommand("stop");
		} else {


			adjustCodePosition();
			$("#code").typewriter();
		}

		</script>
				<iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width=200 height=86 src="http://music.163.com/outchain/player?type=2&id=333750&auto=1&height=66"></iframe>
		<!-- sakura shader -->
		<script id="sakura_point_vsh" type="x-shader/x_vertex">
			uniform mat4 uProjection;
			uniform mat4 uModelview;
			uniform vec3 uResolution;
			uniform vec3 uOffset;
			uniform vec3 uDOF;  //x:focus distance, y:focus radius, z:max radius
			uniform vec3 uFade; //x:start distance, y:half distance, z:near fade start
			
			attribute vec3 aPosition;
			attribute vec3 aEuler;
			attribute vec2 aMisc; //x:size, y:fade
			
			varying vec3 pposition;
			varying float psize;
			varying float palpha;
			varying float pdist;
			
			//varying mat3 rotMat;
			varying vec3 normX;
			varying vec3 normY;
			varying vec3 normZ;
			varying vec3 normal;
			
			varying float diffuse;
			varying float specular;
			varying float rstop;
			varying float distancefade;
			void main(void) {
			    // Projection is based on vertical angle
			    vec4 pos = uModelview * vec4(aPosition + uOffset, 1.0);
			    gl_Position = uProjection * pos;
			    gl_PointSize = aMisc.x * uProjection[1][1] / -pos.z * uResolution.y * 0.5;
			    
			    pposition = pos.xyz;
			    psize = aMisc.x;
			    pdist = length(pos.xyz);
			    palpha = smoothstep(0.0, 1.0, (pdist - 0.1) / uFade.z);
			    
			    vec3 elrsn = sin(aEuler);
			    vec3 elrcs = cos(aEuler);
			    mat3 rotx = mat3(
			        1.0, 0.0, 0.0,
			        0.0, elrcs.x, elrsn.x,
			        0.0, -elrsn.x, elrcs.x
			    );
			    mat3 roty = mat3(
			        elrcs.y, 0.0, -elrsn.y,
			        0.0, 1.0, 0.0,
			        elrsn.y, 0.0, elrcs.y
			    );
			    mat3 rotz = mat3(
			        elrcs.z, elrsn.z, 0.0, 
			        -elrsn.z, elrcs.z, 0.0,
			        0.0, 0.0, 1.0
			    );
			    mat3 rotmat = rotx * roty * rotz;
			    normal = rotmat[2];
			    
			    mat3 trrotm = mat3(
			        rotmat[0][0], rotmat[1][0], rotmat[2][0],
			        rotmat[0][1], rotmat[1][1], rotmat[2][1],
			        rotmat[0][2], rotmat[1][2], rotmat[2][2]
			    );
			    normX = trrotm[0];
			    normY = trrotm[1];
			    normZ = trrotm[2];
			    
			    const vec3 lit = vec3(0.6917144638660746, 0.6917144638660746, -0.20751433915982237);
			    
			    float tmpdfs = dot(lit, normal);
			    if(tmpdfs < 0.0) {
			        normal = -normal;
			        tmpdfs = dot(lit, normal);
			    }
			    diffuse = 0.4 + tmpdfs;
			    
			    vec3 eyev = normalize(-pos.xyz);
			    if(dot(eyev, normal) > 0.0) {
			        vec3 hv = normalize(eyev + lit);
			        specular = pow(max(dot(hv, normal), 0.0), 20.0);
			    }
			    else {
			        specular = 0.0;
			    }
			    
			    rstop = clamp((abs(pdist - uDOF.x) - uDOF.y) / uDOF.z, 0.0, 1.0);
			    rstop = pow(rstop, 0.5);
			    //-0.69315 = ln(0.5)
			    distancefade = min(1.0, exp((uFade.x - pdist) * 0.69315 / uFade.y));
			}
			</script>
		<script id="sakura_point_fsh" type="x-shader/x_fragment">
			#ifdef GL_ES
			//precision mediump float;
			precision highp float;
			#endif
			
			uniform vec3 uDOF;  //x:focus distance, y:focus radius, z:max radius
			uniform vec3 uFade; //x:start distance, y:half distance, z:near fade start
			
			const vec3 fadeCol = vec3(0.08, 0.03, 0.06);
			
			varying vec3 pposition;
			varying float psize;
			varying float palpha;
			varying float pdist;
			
			//varying mat3 rotMat;
			varying vec3 normX;
			varying vec3 normY;
			varying vec3 normZ;
			varying vec3 normal;
			
			varying float diffuse;
			varying float specular;
			varying float rstop;
			varying float distancefade;
			
			float ellipse(vec2 p, vec2 o, vec2 r) {
			    vec2 lp = (p - o) / r;
			    return length(lp) - 1.0;
			}
			
			void main(void) {
			    vec3 p = vec3(gl_PointCoord - vec2(0.5, 0.5), 0.0) * 2.0;
			    vec3 d = vec3(0.0, 0.0, -1.0);
			    float nd = normZ.z; //dot(-normZ, d);
			    if(abs(nd) < 0.0001) discard;
			    
			    float np = dot(normZ, p);
			    vec3 tp = p + d * np / nd;
			    vec2 coord = vec2(dot(normX, tp), dot(normY, tp));
			    
			    //angle = 15 degree
			    const float flwrsn = 0.258819045102521;
			    const float flwrcs = 0.965925826289068;
			    mat2 flwrm = mat2(flwrcs, -flwrsn, flwrsn, flwrcs);
			    vec2 flwrp = vec2(abs(coord.x), coord.y) * flwrm;
			    
			    float r;
			    if(flwrp.x < 0.0) {
			        r = ellipse(flwrp, vec2(0.065, 0.024) * 0.5, vec2(0.36, 0.96) * 0.5);
			    }
			    else {
			        r = ellipse(flwrp, vec2(0.065, 0.024) * 0.5, vec2(0.58, 0.96) * 0.5);
			    }
			    
			    if(r > rstop) discard;
			    
			    vec3 col = mix(vec3(1.0, 0.8, 0.75), vec3(1.0, 0.9, 0.87), r);
			    float grady = mix(0.0, 1.0, pow(coord.y * 0.5 + 0.5, 0.35));
			    col *= vec3(1.0, grady, grady);
			    col *= mix(0.8, 1.0, pow(abs(coord.x), 0.3));
			    col = col * diffuse + specular;
			    
			    col = mix(fadeCol, col, distancefade);
			    
			    float alpha = (rstop > 0.001)? (0.5 - r / (rstop * 2.0)) : 1.0;
			    alpha = smoothstep(0.0, 1.0, alpha) * palpha;
			    
			    gl_FragColor = vec4(col * 0.5, alpha);
			}
			</script>
		<!-- effects -->
		<script id="fx_common_vsh" type="x-shader/x_vertex">
			uniform vec3 uResolution;
			attribute vec2 aPosition;
			
			varying vec2 texCoord;
			varying vec2 screenCoord;
			
			void main(void) {
			    gl_Position = vec4(aPosition, 0.0, 1.0);
			    texCoord = aPosition.xy * 0.5 + vec2(0.5, 0.5);
			    screenCoord = aPosition.xy * vec2(uResolution.z, 1.0);
			}
			</script>
		<script id="bg_fsh" type="x-shader/x_fragment">
			#ifdef GL_ES
			//precision mediump float;
			precision highp float;
			#endif
			
			uniform vec2 uTimes;
			
			varying vec2 texCoord;
			varying vec2 screenCoord;
			
			void main(void) {
			    vec3 col;
			    float c;
			    vec2 tmpv = texCoord * vec2(0.8, 1.0) - vec2(0.95, 1.0);
			    c = exp(-pow(length(tmpv) * 1.8, 2.0));
			    col = mix(vec3(0.02, 0.0, 0.03), vec3(0.96, 0.98, 1.0) * 1.5, c);
			    gl_FragColor = vec4(col * 0.5, 1.0);
			}
			</script>
		<script id="fx_brightbuf_fsh" type="x-shader/x_fragment">
			#ifdef GL_ES
			//precision mediump float;
			precision highp float;
			#endif
			uniform sampler2D uSrc;
			uniform vec2 uDelta;
			
			varying vec2 texCoord;
			varying vec2 screenCoord;
			
			void main(void) {
			    vec4 col = texture2D(uSrc, texCoord);
			    gl_FragColor = vec4(col.rgb * 2.0 - vec3(0.5), 1.0);
			}
			</script>
		<script id="fx_dirblur_r4_fsh" type="x-shader/x_fragment">
			#ifdef GL_ES
			//precision mediump float;
			precision highp float;
			#endif
			uniform sampler2D uSrc;
			uniform vec2 uDelta;
			uniform vec4 uBlurDir; //dir(x, y), stride(z, w)
			
			varying vec2 texCoord;
			varying vec2 screenCoord;
			
			void main(void) {
			    vec4 col = texture2D(uSrc, texCoord);
			    col = col + texture2D(uSrc, texCoord + uBlurDir.xy * uDelta);
			    col = col + texture2D(uSrc, texCoord - uBlurDir.xy * uDelta);
			    col = col + texture2D(uSrc, texCoord + (uBlurDir.xy + uBlurDir.zw) * uDelta);
			    col = col + texture2D(uSrc, texCoord - (uBlurDir.xy + uBlurDir.zw) * uDelta);
			    gl_FragColor = col / 5.0;
			}
			</script>
		<!-- effect fragment shader template -->
		<script id="fx_common_fsh" type="x-shader/x_fragment">
			#ifdef GL_ES
			//precision mediump float;
			precision highp float;
			#endif
			uniform sampler2D uSrc;
			uniform vec2 uDelta;
			
			varying vec2 texCoord;
			varying vec2 screenCoord;
			
			void main(void) {
			    gl_FragColor = texture2D(uSrc, texCoord);
			}
			</script>
		<!-- post processing -->
		<script id="pp_final_vsh" type="x-shader/x_vertex">
			uniform vec3 uResolution;
			attribute vec2 aPosition;
			varying vec2 texCoord;
			varying vec2 screenCoord;
			void main(void) {
			    gl_Position = vec4(aPosition, 0.0, 1.0);
			    texCoord = aPosition.xy * 0.5 + vec2(0.5, 0.5);
			    screenCoord = aPosition.xy * vec2(uResolution.z, 1.0);
			}
			</script>
		<script id="pp_final_fsh" type="x-shader/x_fragment">
			#ifdef GL_ES
			//precision mediump float;
			precision highp float;
			#endif
			uniform sampler2D uSrc;
			uniform sampler2D uBloom;
			uniform vec2 uDelta;
			varying vec2 texCoord;
			varying vec2 screenCoord;
			void main(void) {
			    vec4 srccol = texture2D(uSrc, texCoord) * 2.0;
			    vec4 bloomcol = texture2D(uBloom, texCoord);
			    vec4 col;
			    col = srccol + bloomcol * (vec4(1.0) + srccol);
			    col *= smoothstep(1.0, 0.0, pow(length((texCoord - vec2(0.5)) * 2.0), 1.2) * 0.5);
			    col = pow(col, vec4(0.45454545454545)); //(1.0 / 2.2)
			    
			    gl_FragColor = vec4(col.rgb, 1.0);
			    gl_FragColor.a = 1.0;
			}
			</script>

	</body>
</html>
